//展示分类信息 别的同事已经做过，我们直接拷贝过来稍微修改一下就完成了
//这个ajax只能作用于添加表单，对编辑表单有可能有用，有可能没用，没办法保证的
//页面一打开就会执行
$.ajax({
	type:'get',
	url:'/categories',
	success:function(res){
		var html = template('categoryTpl',{data:res})
		$('#category').html(html)
	}
})

//添加第二步、图片上传功能（之前做过一次）

$('#feature').on('change',function(){
	var formData = new FormData();
	formData.append('cover',this.files[0]);
	$.ajax({
		type:'post',
		url:'/upload',
		data:formData,
		processData:false,
		contentType:false,
		success:function(res){
			console.log(res);
			//把拿到数据赋值给自己添加的隐藏域
			//大家在留言板说一下这一步目的?
			$('#thumbnail').val(res[0].cover)
		}
	})
})

// 文章添加功能 暂时还没有做
$('#addForm').on('submit',function(){
	//收集表单数据
	var data = $(this).serialize()
	//ajax
	$.ajax({
		type:'post',
		url:'/posts',
		data:data,
		success:function(){
			//如果成功之后，跳转到文章的列表页
			location.href = './posts.html'
		}
	})
	return false;
})


// 隐藏域作用：
// 1. 表单的作用是把用户填写的内容发送到后台
// 2. 表单控件input来填写用户的数据
// 3. 有些情况下我们需要向后台传递一个数据，但是这个数据不能被用户看到
// 4. 所有的input控件必须要name属性，才能传递到后台

// location api(属于BOM知识点)
// 1. location.reload() 刷新当前页面
// 2. location.href = 'http://www.baidu.com'跳转到百度官网
// 3. location.href 可以获取到当前页面的url值
// 4. location.search 可以获取到url的一部分东西(查询参数) 可以获取?号后面的东西

// 一个网站，有可能很多地方都会涉及到获取url中的参数的值
//为了代码更加有扩展性
// 通用性更强一点

var id = getUrlParams('id')
console.log(id);
//我们是把新增和编辑做在同一个页面 如果?id存在，说明当前是编辑，如果没有，说明是新增
if(id != -1){//判断当前是不是在做编辑功能
//是在做编辑
	// 通过id查询出来当前这个id值对应文章 --> 使用模板引擎把数据和模板拼在一起
	//我们必须先有整个修改的表单，再才能有分类的东西
	
	// 通过id获取文章的数据
	$.ajax({
		type:'get',
		url:`/posts/${id}`,
		success:function(res){
			//获取分类的数据
			$.ajax({
				type:'get',
				url:'/categories',
				success:function(categories){
					res.categories = categories;//res同时拿到了文章的数据和分类的数据
					console.log(res);
					var html = template('modifyTpl',res);
					$('#parentBox').html(html)
				}
			})
		}
	})


	//使用事件委托给修改表单添加提交事件
	$('#parentBox').on('submit','#modifyForm',function(){
		var data = $(this).serialize()
		var id = $(this).attr('data-id');
		$.ajax({
			type:'put',
			url:`/posts/${id}`,
			data:data,
			success:function(){
				location.href = './posts.html'
			}
		})
	})
}


// 如果图片上传没有用事件委托，必须嵌套

// 找到规律 a=1&b=2&c=3
function getUrlParams(key){
	var paramsArr = location.search.substr(1).split('&');
	//对数组一般会采用遍历
	for(var i=0;i<paramsArr.length;i++){
		var arr = paramsArr[i].split('=');//第0项是key 第1项是value
		if(arr[0] == key){
			return arr[1];
		}
	}
	//如果for循环结束了，如果代码可以执行到这一步，说明根本没有匹配上，没有找到
	return -1;//随便写的，外面通过这个-1这个值明白没有找到
}

//补充知识点（稍微了解一下）内置API可以用拿到值


// var str = 'a=1&b=2&c=3';
// var obj = new URLSearchParams(str);
// console.log(obj.get('b'));